<!DOCTYPE html>
<html class="loading" lang="en" data-textdirection="ltr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimal-ui">
<meta name="author" content="PIXINVENT">
<title>自助售货管理后台</title>
<link rel="stylesheet" type="text/css" href="app-assets/css/vendors.css">
<link rel="stylesheet" type="text/css" href="app-assets/css/vertical-menu.css">
<link rel="stylesheet" type="text/css" href="app-assets/css/bootstrap-extended.css">
</head>
<body>
<div class="content-wrapper">
  <div class="content-header ">
    <div class="content-header-left mb-2 clearfix">
      <h3 class="content-header-title mb-0">结算记录</h3>
    </div>
  </div>
  <div class="card">
    <div class="card-content">
      <div class="card-body">
        <div class="tablebox1">
          <table class="table">
            <thead>
              <tr>
                <th>订单ID</th>
                <th>结算金额</th>
                <th>处理状态</th>
                <th>代理商名称</th>
                <th>发货时间</th>
                <th>操作</th>
              </tr>
            </thead>
            <tbody id="showMessage">
            </tbody>
          </table>
          <div class="page clearfix">
            <div class="pull-left">共 <span id="totalCount"></span>条记录 第 <span id="pageNum"></span> / <span id="pages"></span> 页</div>
            <div class="pull-right">
              <nav aria-label="..." class="pull-left">
                <ul class="pagination" id="pagination">
                  <li class="disabled"><a href="#" aria-label="Previous"><span aria-hidden="true">«</span></a></li>
                  <li class="active"><a href="#">1 <span class="sr-only">(current)</span></a></li>
                  <li><a href="#">2</a></li>
                  <li><a href="#">3</a></li>
                  <li><a href="#">4</a></li>
                  <li><a href="#">5</a></li>
                  <li><a href="#" aria-label="Next"><span aria-hidden="true">»</span></a></li>
                </ul>
              </nav>
              <div class="pull-left p-r-20  p-l-20">
                <select class="form-control" id="pageSizeSelect" disabled>
                  <option value="8">8条每页</option>
                </select>
              </div>
              <div class="pull-left">跳至<input type="text" value="1" class="form-control" id="jumpPageInput">页</div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>
<script src="app-assets/js/vendors.min.js" type="text/javascript"></script> 
<script src="app-assets/js/app-menu.js" type="text/javascript"></script> 
<script src="app-assets/js/app.js" type="text/javascript"></script> 
<script src="app-assets/js/echarts.min.js" type="text/javascript"></script> 
<script src="app-assets/js/sweetalert2.js" type="text/javascript"></script> 
</body>
</html>
 <script>
$(function(){
  console.log(window.sessionStorage.getItem("empName"))
            var loginMessage = window.sessionStorage.getItem("empName")
            if(loginMessage==null){
                alert("请先登录")
                window.location.href="./index.html"
            }
    onloadOk(1);
})
 var pageNum = 1;
function onloadOk(pageNum) {
    $.ajax({
        url: 'http://localhost:18081/purchaseSettlement/selectPurchaseSettlementSuppliers',
        type: 'get',
        dataType: 'json',
        data: {
            pageNum: pageNum,
        },
        success: function(data) {
			pageNum = data.data.pageNum;
            $('#totalCount').html(data.data.total);
            $('#pageNum').html(data.data.pageNum);
            $('#pages').html(data.data.pages);
            $('#showMessage').empty();
            console.log(data);
            var showMessage = data.data.list;
            var status = "";
			var showButtonMessage = ""
            showMessage.forEach(function(item) {
                if (item.settlementStatus == 0) {
                    status = "未结算";
					showButtonMessage = "结算"
					var buttonDisabled = ""; // 不禁用按钮
                } else if (item.settlementStatus == 1) {
                    status = "已结算";
					showButtonMessage = "已结算不可操作"
					var buttonDisabled = "disabled"; // 禁用按钮
                }
                var str = `
                    <tr>
                        <td>${item.poId}</td>
                        <td>${item.totalAmount}</td>
                        <td>${status}</td>
                        <td>${item.supplierName}</td>
                        <td>${item.shipment}</td>
                        <td><button class="btn btn-primary" onclick="updateStatusButton(${item.poId}, '${item.supplierId}')" ${buttonDisabled}>${showButtonMessage}</button></td>
                    </tr>
                `;
                $('#showMessage').append(str);
            });
            // 更新分页按钮
            updatePagination(data.data.pageNum, data.data.pages);
        }
    });
}

function updatePagination(currentPage, totalPages) {
    $('#pagination').empty();

    // 添加上一页按钮
    if (currentPage > 1) {
        $('#pagination').append('<li><a href="#" onclick="changePage(' + (currentPage - 1) + ')"><span aria-hidden="true">«</span></a></li>');
    } else {
        $('#pagination').append('<li class="disabled"><a href="#" aria-label="Previous"><span aria-hidden="true">«</span></a></li>');
    }

    // 添加页码按钮
    for (let i = 1; i <= totalPages; i++) {
        if (i === currentPage) {
            $('#pagination').append('<li class="active"><a href="#">' + i + ' <span class="sr-only">(current)</span></a></li>');
        } else {
            $('#pagination').append('<li><a href="#" onclick="changePage(' + i + ')">' + i + '</a></li>');
        }
    }

    // 添加下一页按钮
    if (currentPage < totalPages) {
        $('#pagination').append('<li><a href="#" onclick="changePage(' + (currentPage + 1) + ')"><span aria-hidden="true">»</span></a></li>');
    } else {
        $('#pagination').append('<li class="disabled"><a href="#" aria-label="Next"><span aria-hidden="true">»</span></a></li>');
    }
}

function changePage(pageNum) {
    onloadOk(pageNum);
}

function updateStatusButton(poId, supplierId) {
    alert(poId + "   " + supplierId);
    $.ajax({
        url: 'http://localhost:18081/purchaseSettlement/updatePurchaseSettlementStatus',
        type: 'post',
        data: { poId: poId, supplierId: supplierId },
        dataType: 'json',
        success: function(data) {
            console.log(data);
            onloadOk(pageNum);
        }
    });
}

// 处理跳转到指定页
$('#jumpPageInput').change(function() {
    const jumpPage = $(this).val();
    const totalPages = $('#pages').text();
    if (jumpPage > 0 && jumpPage <= totalPages) {
        onloadOk(jumpPage);
    } else {
        alert('请输入有效的页码');
    }
});
</script>